.date-range-view {
  -fx-padding: 10;
  -fx-background-insets: 0px, 1px;
  -fx-background-color: -color-border-default, -color-bg-overlay;
  -fx-effect: dropshadow(gaussian, -color-shadow-default, 20, 0.65, 0, 0);
}

.date-range-view > .range-view-container {
  -fx-spacing: 15;

}

.date-range-view > .range-view-container > .stack-pane > .months-box {
  -fx-spacing: 16px;
}

.date-range-view > .range-view-container > .stack-pane > .to-label {
  -size: 34px;
  -fx-min-width: -size;
  -fx-min-height: -size;
  -fx-pref-width: -size;
  -fx-pref-height: -size;
  -fx-max-width: -size;
  -fx-max-height: -size;

  -fx-background-color: -color-border-default, -color-bg-overlay;
  -fx-background-insets: 0px, 1px;
  -fx-background-radius: 1000px, 1000px;
  -fx-padding: 5px;
  -fx-effect: dropshadow(gaussian, -color-shadow-default, 10, 0.12, -1, 2);

  -fx-alignment: center;
}

.date-range-view > .range-view-container > .presets-box {
  -fx-spacing: 10;
  -fx-padding: 0px 10px;
}

.date-range-view > .range-view-container > .presets-box > .presets-title {
  -fx-font-size: 14px;
  -fx-font-weight: bold;
  -fx-padding: 0 0 15 0;
}

.date-range-view > .range-view-container > .presets-box > .buttons-box {
  -fx-spacing: 10px;
}

.date-range-view > .range-view-container > .presets-box > .buttons-box > .apply-button {
}

.date-range-view > .range-view-container > .presets-box > .buttons-box > .cancel-button {
}

.date-range-view > .range-view-container > .presets-box > .preset-name-label {
  -fx-cursor: hand;
  -fx-text-fill: -color-accent-fg;
}

.date-range-view > .range-view-container > .presets-box > .preset-name-label:hover {
  -fx-underline: true;
}

.date-range-view > .range-view-container > .presets-box > .separator > .line {
  -fx-border-color: -color-fg-muted transparent transparent transparent;
}
